<script setup lang="ts">

defineProps({
  route: {
    type: Object,
    default: () => {
      return
    }
  },
  menu: {
    type: Object,
    default: () => {
      return []
    }
  }
})

</script>

<template>

    <el-sub-menu v-if="menu && menu.children && menu.children.length>0" :key="menu.route" :index="menu.route">
      <template #title>
        <el-icon>
          <component :is="menu.icon"></component>
        </el-icon>
        <span>{{ menu.desc }}</span>
      </template>
      <menuItem  v-for="cMenu in menu.children" :menu="cMenu"></menuItem>
    </el-sub-menu>
    <el-menu-item v-else :index="`${menu.route}`">
      <el-icon>
        <component :is="menu.icon"></component>
      </el-icon>
      <template #title>{{ menu.desc }}</template>
    </el-menu-item>


</template>

<style scoped>

</style>
